<template>
  <view class="u-page" style="background-color: #ffffff;height: 100vh;overflow: hidden;">
<!--    <view style="padding: 1vw">-->
<!--      <view class="search-bar">-->
<!--        <up-form>-->
<!--          <up-form-item-->
<!--              label="留言人姓名："-->
<!--              labelWidth="auto">-->
<!--            <up-input v-model="search.messagerUserName" placeholder="请输入留言人姓名"/>-->
<!--          </up-form-item>-->
<!--          <view>-->
<!--            <up-row customStyle="margin-bottom: 10px">-->
<!--              <up-col span="6">-->
<!--                <up-button type="primary" style="width: 70%;" @click="toSearch">查询</up-button>-->
<!--              </up-col>-->
<!--              <up-col span="6">-->
<!--                <up-button type="primary" style="width: 70%" @click="toReset">重置</up-button>-->
<!--              </up-col>-->
<!--            </up-row>-->
<!--          </view>-->
<!--        </up-form>-->
<!--      </view>-->
<!--    </view>-->
<!--    <up-divider></up-divider>-->
    <view class="list-container" style="height: 85vh;overflow-y: scroll">
      <scroll-view
          refresher-enabled
          @refresherrefresh="pullDownList"
          :refresher-triggered="triggered"
      >
        <up-list>
        <view v-for="(item,index) in listData" :key="index">
          <view>
            <span><up-avatar style="margin-left: 5vw;" size="25" :src="avatar"></up-avatar></span>
            <span style="color:gray;margin-top: 1vh;margin-left: 5vw">{{item.messagerNickName}}</span>
            <span style="color:gray;position: relative;left: 140px;top: -25px">{{item.messageTime}}</span>
          </view>
          <view style="border: 1px solid rgb(243,244,248);background-color: rgb(244,248,251);border-radius:10px;"  >
            <view>
              <view style="margin: 20px 20px 20px 20px;font-size: 11pt">{{item.messageContent}}</view>
            </view>
          </view>
          <up-divider></up-divider>
        </view>
        </up-list>
      </scroll-view>
    </view>
    <up-row customStyle="margin-bottom: 10px">
      <up-col span="8" style="margin-left: 5px">
        <view :span="18"><up-textarea confirmType="return" v-model="addForm.messageContent"  height="40" placeholder="请输入内容" ></up-textarea></view>
      </up-col>
      <up-col span="4">
        <view :span="6" align="center"><up-button @click="sendMessage" style="width: 100px;height: 50px;justify-content: center;align-items: center" type="primary">发送</up-button></view>
      </up-col>
    </up-row>
  </view>
</template>

<script setup>
import { ref } from 'vue';
import useUserStore from '@/store/modules/user'
import { getAllLyList,addLYAPI } from '@/api/system/sysIndex.js'
const listData = ref([]) // 存储分页数据
const show = ref(false)
const search = ref({
  pageNum:1,
  pageSize:100,
  messagerUserName:'',  //留言人姓名
  messageTime:null,  //留言时间
})
const userStore = useUserStore()
const avatar = ref(userStore.avatar);
function cancel (){
  show.value = false
}
const options1 = ref([{
  text: '查看',
  style:{
    backgroundColor:'#3c9cff'
  }
}]);
const loadmoreStatus = ref('loadmore')
//查询
function toSearch(){
  console.log(search.value.messageTime)
  if (search.value.messageTime){
    const date = new Date(search.value.messageTime);
    const year = date.getFullYear();
    const month = String(date.getMonth() + 1).padStart(2, '0');
    const day = String(date.getDate()).padStart(2, '0');
    const formattedTime = `${year}-${month}-${day}`;
    search.value.messageTime = formattedTime
  }
  console.log(search.value.messageTime)
  pullDownList()
}
//重置
function toReset(){
  search.value = {
    pageNum:1,
    pageSize:100,
    equipmentName:'',  //设备名称
    equipmentNum:''  //设备编号
  }
  pullDownList()
}

//下拉刷新
const triggered=ref(false)
function pullDownList(){
  triggered.value = true
  getYqsygdList()
}

//查看仪器使用规定
function handleButtonClick1(item) {
  uni.navigateTo({
    url: `/pages/laboratory/yqsygdDetail?equipmentUsageRegulations=${item.equipmentUsageRegulations}&equipmentName=${item.equipmentName}&equipmentNum=${item.equipmentNum}&attachmentUrl=${item.attachmentUrl}&attachmentNames=${item.attachmentNames}`
  });
}
// //查询通知列表
function getYqsygdList(){
  search.value.pageNum = 1
  loadmoreStatus.value = 'loadmore'
  // 模拟请求后端接口获取分页数据
  getAllLyList(search.value).then((response) => {
    listData.value = response.rows || [];
    setTimeout(()=>{
      triggered.value = false
    },1000)
  });
}
const addForm = ref({
  messageContent:''
})
//发送消息按钮
function sendMessage(){
  addLYAPI(addForm.value)
      .then((response) => {
        uni.showToast({
          title: ' 发送成功！',
          mask: false,
          icon: "success",
        });
        getYqsygdList()
        addForm.value = {
          messageContent:'',
        }
      }).catch((err) => {
    uni.showToast({
      title: err.message,
      mask: false,
      icon: "none",
    });
  })
}

getYqsygdList()
</script>

<style lang="scss" scoped>

</style>
